<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="${BaseContext }">
<meta charset="utf-8" />
<title>考试测试 - 20170901</title>
<link rel="stylesheet" href="http://cdn.amazeui.org/amazeui/2.7.2/css/amazeui.min.css" />
<style>
th {
	text-align: center;
}

td {
	text-align: center;
}

.dataDiv {
	margin-top: 50px;
}
</style>
</head>
<body>
	<div class="am-container dataDiv">
		<section class="am-panel am-panel-primary"> <header class="am-panel-hd">
		<h3 class="am-panel-title">商家信息展示</h3>
		</header>
		<div class="am-panel-bd">
			<table class="am-table am-table-bordered">

				<tbody>

					<tr>
						<th class="am-u-sm-4">商家名称</th>
						<td class="am-u-sm-8">${tModel.shopName }</td>
					</tr>
					<tr>
						<th class="am-u-sm-4">法人</th>
						<td class="am-u-sm-8">${tModel.peopleName }</td>
					</tr>
					<tr>
						<th class="am-u-sm-4">联系地址</th>
						<td class="am-u-sm-8">${tModel.address }</td>
					</tr>
					<tr>
						<th class="am-u-sm-4">联系电话</th>
						<td class="am-u-sm-8">${tModel.phone }</td>
					</tr>
					<tr>
						<th class="am-u-sm-4">所属行业</th>
						<td class="am-u-sm-8">${tModel.trade }</td>
					</tr>
					<tr>
						<th class="am-u-sm-4">备注说明</th>
						<td class="am-u-sm-8">${tModel.remark }</td>
					</tr>

					<tr>
						<th class="am-u-sm-4">营业执照</th>
						<td class="am-u-sm-8">
							<div>
								<a title="点击查看大图" href="${tModel.avator }" target="_blank">
									<img src="${tModel.avator }" width="120px" />
								</a>
							</div>
							<div class="am-text-right">
								<form class="am-form-inline am-hide" action="index.do" enctype="multipart/form-data"
									id="imgForm" style="margin-top: 10px;" method="post">
									<div class="am-form-group">
										<input type="file" id="avator" name="avator">

									</div>
									<button type="submit">
										<a class="am-btn am-btn-default" id="updateImg">更新</a>
									</button>
									<a href="javascript:void(0)" id="cancleImg">取消</a>
								</form>
								<a href="javascript:void(0);" id="editImg">编辑营业执照</a>
							</div>
						</td>
					</tr>

				</tbody>
			</table>
			<p>信息录入时间：${tModel.registTime }&nbsp;&nbsp;最后更新时间：${tModel.updateTime }</p>
		</div>
		<div class="am-panel-footer">
			<button class="am-btn am-btn-primary" id="editBtn">编辑基本信息</button>

		</div>
		</section>
	</div>


	<div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal">
		<div class="am-modal-dialog">
			<div class="am-modal-hd">
				<a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
			</div>
			<div class="am-modal-bd">
				<form class="am-form am-text-left am-form-horizontal" action="ajax.do" id="ajaxForm" method="post">

					<div class="am-form-group">
						<label for="doc-ipt-1" class="am-u-sm-3 am-form-label">商家名称</label>
						<div class="am-u-sm-9">
							<input type="text" class="" name="shopName" id="doc-ipt-1" placeholder="商家名称" value="${tModel.shopName }">
						</div>
					</div>
					<div class="am-form-group">
						<label for="doc-ipt-2" class="am-u-sm-3 am-form-label">法人</label>
						<div class="am-u-sm-9">
							<input type="text" class="" name="peopleName" id="doc-ipt-2" placeholder="法人" value="${tModel.peopleName }">
						</div>
					</div>
					<div class="am-form-group">
						<label for="doc-ipt-3" class="am-u-sm-3 am-form-label">联系地址</label>
						<div class="am-u-sm-9">
							<input type="text" class="" name="address" id="doc-ipt-3" placeholder="联系地址" value="${tModel.address }">
						</div>
					</div>
					<div class="am-form-group">
						<label for="doc-ipt-4" class="am-u-sm-3 am-form-label">联系电话</label>
						<div class="am-u-sm-9">
							<input type="text" class="" name="phone" id="doc-ipt-4" placeholder="联系电话" value="${tModel.phone }">
						</div>
					</div>

					<div class="am-form-group">
						<label for="doc-select-1" class="am-u-sm-3 am-form-label">行业</label>
						<div class="am-u-sm-9">
							<select id="doc-select-1" name="trade">
								<option value="">选择商家行业性质</option>
								<option value="教育" >教育</option>
								<option value="视频">视频</option>
								<option value="文化">文化</option>
								<option value="体育">体育</option>
							</select>
						</div>
					</div>

					<div class="am-form-group">
						<label for="doc-ta-1" class="am-u-sm-3 am-form-label">备注说明</label>
						<div class="am-u-sm-9">
							<textarea class="" name="remark" rows="5" id="doc-ta-1" >${tModel.remark }</textarea>
						</div>
					</div>

					<p class="am-fr">
						<button type="button" class="am-btn am-btn-default" id="cancleBtn">取消</button>
						<button type="submit" class="am-btn am-btn-primary" id="submitBtn">提交</button>
					</p>
				</form>


			</div>
		</div>
	</div>



	<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
	<script src="http://cdn.amazeui.org/amazeui/2.7.2/js/amazeui.min.js"></script>
	<script src="static/js/jquery.form.min.js"></script>
	<script>
		$(function() {
			console.log("start");
			$("#editBtn").click(function() {
				$('#doc-modal').modal('open');

			});
			$('#cancleBtn').click(function() {
				$('#doc-modal').modal('close');
			});
			$('#submitBtn').click(function() {
				console.log("1heheda");
				$('#ajaxForm').ajaxForm(function(date) {
					console.log("2heheda");
					if (date.success) {
						console.log("3heheda");
						alert("修改成功！！！");
						location.reload();
					} else {
						console.log("4heheda");
						alert("修改失败！！！");
					}
				},'json')
				$('#doc-modal').modal('close');
			});

			$('#editImg').click(function() {
				$('#imgForm').removeClass('am-hide');
				$('#editImg').hide();

			});
			$('#cancleImg').click(function() {
				$('#imgFile').val('');
				$('#imgForm').addClass('am-hide');
				$('#editImg').show();
			});
			$('#updateImg').click(function() {
				alert('提交文件不需要使用ajax，form表单提交即可，提交后重新返回到当前页面');
				location.reload();
			});
		});
	</script>
</body>

</html>